<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>用户操作日志</title>
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<link rel="stylesheet" href="../../css/oksub.css">
	<script type="text/javascript" src="../../lib/loading/okLoading.js"></script>
</head>
<body>
<div class="ok-body">
	<!--模糊搜索区域-->
	<!--<div class="layui-row">-->
		<!--<form class="layui-form layui-col-md12 ok-search">-->
			<!--<input class="layui-input" placeholder="开始日期" autocomplete="off" id="startTime" name="startTime">-->
			<!--<input class="layui-input" placeholder="截止日期" autocomplete="off" id="endTime" name="endTime">-->
			<!--<input class="layui-input" placeholder="请输入角色名" autocomplete="off" name="name">-->
			<!--<button class="layui-btn" lay-submit="" lay-filter="search">-->
				<!--<i class="layui-icon layui-icon-search"></i>-->
			<!--</button>-->
		<!--</form>-->
	<!--</div>-->
	<!--数据表格-->
	<table class="layui-hide" id="tableId" lay-filter="tableFilter"></table>
</div>
<!--
https://gitee.com/Hbangmao/layui-op-table
https://hbangmao.gitee.io/OPTable/layui-op-table/demo/index.html?href=href-more
https://hbangmao.gitee.io/OPTable/layui-op-table/demo/index.html
-->
<!--js逻辑-->
<script src="../../lib/layui/layui.js"></script>
<script src="../../lib/jquery/3.3.0/jquery.min.js" type="text/javascript"></script>
<script src="../../libme/script/tgfApi.js"></script>
<script src="../../libme/pages/body.js"></script>
<script>
	layui.use(["element", "table", "okUtils", "okMock", "jquery","util", "api"], function () {
		let table = layui.table;
		let okMock = layui.okMock;
		let util = layui.util;
		let $ = layui.jquery;
		let api = layui.api;
		okLoading.close();
		// laydate.render({elem: "#startTime", type: "datetime"});
		// laydate.render({elem: "#endTime", type: "datetime"});

		let operLogTable = table.render({
			elem: "#tableId",
			url: okMock.api.operLog.list,
			limit: 20,
			page: true,
			toolbar: "#toolbarTpl",
			size: "sm",
            beforeSuccessDone: function (res) {
                if(res.code !== api.responseCode.success) {
                    api.defaultErrorhandler(res);
                    return false;
                }
            },
            parseData: function (res) {
                return {
                    code: res.code,
                    msg: res.msg,
                    //count: res.code == RESP_SUCCESS ? res.extend.page.totalCounts : 0,
                    count: res.extend.page.totalCounts,
                    //data: res.code == RESP_SUCCESS ? res.extend.page.data.list : ''
                    data: res.extend.page.data.list
                };
            },
            request: {
                pageName:'currentPage',
                limitName:'pageCounts'
            },
            response: {
                statusCode: 200
            },
			cols: [[
				{type: "checkbox",  width: 50},
				{type: "numbers",   title:'序号', width: 50},
				//{field: "infoId",   title: "日志ID",   width: 100, sort: true},
                {field: "title", title: "操作模块", width: 120},
				{field: "businessType", title: "业务类型", width: 100, align: 'center',
					templet: function (d) {
				    	var result;
						switch (d.businessType) {
							case api.modelCode.operLog.businessType.OTHER :
								result = 'OTHER'
                                break;
                            case api.modelCode.operLog.businessType.INSERT :
                                result = 'INSERT'
                                break;
                            case api.modelCode.operLog.businessType.UPDATE :
                                result = 'UPDATE'
                                break;
                            case api.modelCode.operLog.businessType.DELETE :
                                result = 'DELETE'
                                break;
                            case api.modelCode.operLog.businessType.GRANT :
                                result = 'GRANT'
                                break;
                            case api.modelCode.operLog.businessType.EXPORT :
                                result = 'EXPORT'
                                break;
                            case api.modelCode.operLog.businessType.IMPORT :
                                result = 'IMPORT'
                                break;
                            case api.modelCode.operLog.businessType.FORCE :
                                result = 'FORCE'
                                break;
                            case api.modelCode.operLog.businessType.CLEAN :
                                result = 'CLEAN'
                                break;
							default :
                                result = 'OTHER'
							    break;
                        }
                        return result;
                    }
				},
				{field: "method", title: "请求方法", width: 500},
				{field: "requestMethod", title: "请求方式", width: 80, align: 'center'},
				{field: "operatorType", title: "操作类型", width: 100,
					templet: function (d) {
                        var result;
                        switch (d.operatorType) {
                            case api.modelCode.operLog.operatorType.OTHER :
                                result = 'OTHER'
                                break;
                            case api.modelCode.operLog.operatorType.MANAGE :
                                result = 'MANAGE'
                                break;
                            case api.modelCode.operLog.operatorType.MOBILE :
                                result = 'MOBILE'
                                break;
                            default :
                                result = 'OTHER'
                                break;
                        }
                        return result;
                    }
				},
				{field: "operName", title: "操作账号", width: 120},
				{field: "deptName", title: "操作人部门", width: 150},
				{field: "operUrl", title: "请求URL", width: 250},
				{field: "operIp", title: "IP地址", width: 130},
				{field: "operLocation", title: "登录地点", width: 180},
				{field: "operParam", title: "请求参数", width: 350},
				{field: "jsonResult", title: "返回结果", width: 300},
                {field: "status", title: "状态", width: 80, align:'center',
                    templet: function (d) {
                        if(d.status == api.modelCode.operLog.businessStatus.SUCCESS) {
                            return '<span class="layui-badge layui-bg-green">成功</span>';
                        } else if(d.status === api.modelCode.operLog.businessStatus.FAIL) {
                            return '<span class="layui-badge">失败</span>';
                        }
                    }
                },
				{field: "errorMsg", title: "错误消息", width: 300},
                {field: "operTime", title: "操作时间", width: 180, align: "center",
                    templet: function(d){
                        const operTime = d.operTime
                        if(operTime == null){
                            return '-'
                        }
                        return util.toDateString(operTime, 'yyyy-MM-dd HH:mm:dd')
                    }
                },
				{title: "操作", width: 80, templet: "#operationTpl"}
			]],
			done: function (res, curr, count) {// 服务器返回数据, 当前页码, 总记录数
				//console.log(res, curr, count);
                api.doShowUserPermsMenus();
			}
		});

		// form.on("submit(search)", function (data) {
         //    menuTable.reload({
		// 		where: data.field,
		// 		page: {curr: 1}
		// 	});
		// 	console.log("0000")
		// 	return false;
		// });

		table.on("toolbar(tableFilter)", function (obj) {
			switch (obj.event) {
				case "add":
					//add();
					break;
				case "batchDel":
					batchDel();
					break;
			}
		});

		table.on("tool(tableFilter)", function (obj) {
			let rowdata = obj.data;
			switch (obj.event) {
				case "modify":
					//edit(rowdata);
					break;
				case "delete":
					del(rowdata);
					break;
			}
		});

		// function add() {
		// 	api.open("添加日志", "role-add.html", "90%", "90%", null, function () {
         //        roleTable.reload();
		// 	})
		// }

		function batchDel() {
            api.confirm("确定要批量删除吗？", function (index) {
                layer.close(index);
                var checkStatusData = table.checkStatus('tableId').data;
                var ids = [];
                if (checkStatusData.length > 0) {
                    $.each(checkStatusData, function (idx, obj) {
                        ids.push(obj.operId)
                    })
                } else {
                    api.yellowQuestionMsg("未选择有效数据");
                    return;
                }
                //console.log(ids)
                if (ids.length > 0) {
                    deleteByIds(ids)
                }
            });
		}

		// function edit(data) {
		// 	api.open("修改角色", "role-edit.html", "90%", "90%",function (layero, index){
         //            var body = layer.getChildFrame('body', index);//获取弹出层的dom元素
         //            body.find("#roleName").val(data.roleName);
         //            body.find("#roleCode").val(data.roleCode);
         //            body.find("#roleId").val(data.roleId);
         //            body.find("input[name='remark']").val(data.remark);
        //
		// 		},function () {
		// 	    	roleTable.reload();
         //        })
		// }

		function del(data) {
			api.confirm("确定要删除吗？", function () {
                var ids = [];
                ids.push(data.operId);
                deleteByIds(ids);
			})
		}

        function deleteByIds(ids) {
            api.request({
                url: okMock.api.operLog.deleteByIds,
                where:{ids: ids},
                traditional: true
            },function (res, stat) {
                api.tableSuccessMsg(res.name);
            },function () {
                operLogTable.reload();
            })
        }
	})
</script>
<!-- 头工具栏模板 -->
<script type="text/html" id="toolbarTpl">
	<div class="layui-btn-container">
		<div class="layui-inline layui-hide logininfor-delete" lay-event="batchDel"><i class="layui-icon layui-icon-delete"></i></div>
	</div>
</script>
<!-- 行工具栏模板 -->
<script type="text/html" id="operationTpl">
	<a href="javascript:" title="删除日志" class="logininfor-delete layui-hide" lay-event="delete"><i class="layui-icon">&#xe640;</i></a>
</script>
</body>
</html>
